<template>
  <div class="table-title flex items-center">
    <svg-icon
        v-if="hasIcon"
        :icon-class="$route.meta?.icon"
        class="mr-[8px] text-[18px] text-[var(--el-color-primary)]"
    />
    <span>{{ title }}</span>
  </div>
</template>

<script setup>
import { useRoute } from "vue-router";
const route = useRoute()
const { meta = {} } = route
const title = computed(() => meta.title)
const icon = computed(() => meta.icon)
const hasIcon = computed(() => !!icon.value)
</script>
